<style>
.pure_form_extra .mandatory { color: #ff0000; padding-left: 5px; }
table.lo * { font-size: 12px; font-family: Trebuchet MS; }
table.lo { width: 100%; }
table.lo td { vertical-align: top; text-align: left; }
table.lo td.twin { width: 50%; }
table.lo td.twin label { width: 250px !important; }
table.lo td.triplet { width: 33%; }
table.lo td.triplet label { width: 100px !important; }
.fl_extra { background: #ffffff; border: 1px solid #ddd; padding: 10px 20px; }
.pure-button-nohis { color: #666 !important; background: #eee !important; }
.pure-button-copy { color: #fff !important; background: rgb(28, 184, 65) !important; }
</style>

<?php 
$id = Utils::get_param('id', 0);
$opts = new stdClass();
$opts->cd = 't.id = :v1';
$opts->cdv = array(':v1' => $id);
$opts->sel = 't.*, t1.passport_no AS __passport_no, t1.passport_expiry AS __passport_expiry';
$opts->jt = 'LEFT JOIN pb_colg_student AS t1 ON t1.id = t.student_id';
$data = $orm->get('pb_colg_enrollment', NULL, NULL, NULL, NULL, $opts)->d;

$history = array();
if (count($data) > 0) {
  $opts = new stdClass();
  $opts->cd = 't.student_id = :v1 AND t.id != :v2 AND t.start_academic < :v3';
  $opts->cdv = array(':v1' => $data[0]->student_id, ':v2' => $data[0]->id, ':v3' => $data[0]->start_academic);
  $history = $orm->get('pb_colg_enrollment', 't.start_academic', 'DESC', NULL, NULL, $opts)->d;
}

$pg = Utils::get_param('pg', 1);
$opts = new stdClass();
$opts->cd = 't.is_paid = :v1 AND t.is_trial = :v3';
$opts->cdv = array(':v1' => 1, ':v3' => 0);
$objs = $orm->get('pb_colg_enrollment', 'id', 'DESC', $pg, SIZE, $opts);

$vts = unserialize(VTS);
?>
<div class="pure-form pure-form-aligned pure_form_extra" style="padding: 10px; width: 850px;">
  <legend><h3 id="enrl_title"></h3></legend>
  
  <div class="pure-control-group">
    <label>File Completed</label>
    <input id="current" type="checkbox" />
  </div>
  
  <div>&nbsp;</div>
  
  <table class="lo" cellPadding="0" cellSpacing="0">
    <tr>
      <td class="twin">
        <div class="pure-control-group">
          <label>Application for Admission (Enrollment Form)</label>
          <input id="fl_enrollment_form" type="text" />
        </div>
        <div class="pure-control-group">
          <label>Student Contact Detail Form</label>
          <input id="fl_contact_form" type="text" />
        </div>
        <div class="pure-control-group">
          <label>Student Agreement Form</label>
          <input id="fl_agreement_form" type="text" />
        </div>
        <div class="pure-control-group">
          <label>Trust Acknowledgement Form</label>
          <input id="fl_trustaccount_form" type="text" />
        </div>
        <div class="pure-control-group">
          <label>Offer of Place</label>
          <input id="fl_offer" type="text" />
        </div>
        <div class="pure-control-group">
          <label>Confirmation of Place</label>
          <input id="fl_confirmation" type="text" />
        </div>
        <div class="pure-control-group">
          <label>Receipt</label>
          <input id="fl_receipt" type="text" />
        </div>
        <div class="pure-control-group">
          <label>Copy of Passport</label>
          <input id="fl_passport" type="text" />
        </div>
        <div class="pure-control-group">
          <label>Copy of Visa</label>
          <input id="fl_visa" type="text" />
        </div>
      </td>
      <td class="twin">
        <div class="pure-control-group">
          <label>IELTS Result (Language Ability Certificate)</label>
          <input id="fl_ielts" type="text" />
        </div>
        <div class="pure-control-group">
          <label>Academic Transcript (Latest)</label>
          <input id="fl_academic" type="text" />
        </div>
        <div class="pure-control-group">
          <label>School Certificate (Qualification, Etc.)</label>
          <input id="fl_certificate" type="text" />
        </div>
        <div class="pure-control-group">
          <label>International Student Insurance</label>
          <input id="fl_insurance" type="text" />
        </div>
        <div class="pure-control-group">
          <label>Under 18</label>
          <input id="fl_under18" type="text" />
        </div>
        <div class="pure-control-group">
          <label style="width: 75px !important;">Note</label>
          <textarea id="fl_note" style="resize: none; height: 150px; width: 320px;"></textarea>
        </div>
      </td>
    </tr>
  </table>
  
  <div>&nbsp;</div>
  <div class="pure-control-group">
    <label style="width: 250px;">Update Student Personal Information</label>
    <input id="fl_update_personal" type="checkbox" checked="checked"/>
  </div>
  <div class="fl_extra">
    <table class="lo" cellPadding="0" cellSpacing="0">
      <tr>
        <td class="triplet">
          <div class="pure-control-group">
            <label>Passport No.</label>
            <input id="fl_passport_no" type="text" />
          </div>
          <div class="pure-control-group">
            <label>Passport Expiry</label>
            <input id="fl_passport_expiry" type="text" />
          </div>
        </td>
        <td class="triplet">
          <div class="pure-control-group">
            <label>Visa Type</label>
            <select id="fl_visa_type" class="pure-input-1-2">
              <option value=""></option>
            </select>
          </div>
          <div class="pure-control-group">
            <label>Visa Expiry</label>
            <input id="fl_visa_expiry" type="text" />
          </div>
        </td>
        <td class="triplet">
          <div class="pure-control-group">
            <label>INS Company</label>
            <input id="fl_insurance_com" type="text" />
          </div>
          <div class="pure-control-group">
            <label>INS Expiry</label>
            <input id="fl_insurance_expiry" type="text" />
          </div>
          <div class="pure-control-group">
            <label>INS Policy No.</label>
            <input id="fl_insurance_number" type="text" />
          </div>
        </td>
      </tr>
    </table>
  </div>
  <div>&nbsp;</div>
  
  <div class="pure-control-group">
    <label>&nbsp;</label>
    <button class="pure-button pure-input-1-2 pure-button-primary" onclick="submit_obj();">Save</button>
  </div>
</div>

<table class="lo"><tr><td><div id="history"></div></td></tr></table>


<script type="text/javascript">
  /*<![CDATA[*/
  var __objs = JSON.parse('<?php echo addslashes(json_encode($objs)); ?>');
  var __history = JSON.parse('<?php echo addslashes(json_encode($history)); ?>');
  var __data = JSON.parse('<?php echo addslashes(json_encode($data)); ?>');
  var __dir = '<?php echo PLGN_DIR . basename(dirname(__FILE__)); ?>';
  var __requrl = '<?php echo Utils::get_requrl($app_data); ?>';
  var __file = '<?php echo addslashes($app_data->param_file); ?>';
  var __redmd = '<?php echo addslashes($app_data->sys->redmd); ?>';
  var __sys = '<?php echo addslashes($app_data->sys->php_name); ?>';
  var __id = '<?php echo $app_data->param_id; ?>';
  var __session_id = '<?php echo session_id(); ?>';
  var __tmp = null;
  var __vts = JSON.parse('<?php echo addslashes(json_encode($vts)); ?>');
  
  $(function() {
    reset();
    for (var idx in __vts) {
      var itm = __vts[idx];
      $('#fl_visa_type').append('<option value="' + itm + '">' + itm + '</option>');
    }
    $('#fl_visa_type').chosen({
      allow_single_deselect: true
    });

    $('#fl_passport_expiry').datepicker({
      changeMonth: true,
      changeYear: true,
      dateFormat: "yy-mm-dd",
      showButtonPanel: true
    });
    $('#fl_visa_expiry').datepicker({
      changeMonth: true,
      changeYear: true,
      dateFormat: "yy-mm-dd",
      showButtonPanel: true
    });
    $('#fl_insurance_expiry').datepicker({
      changeMonth: true,
      changeYear: true,
      dateFormat: "yy-mm-dd",
      showButtonPanel: true
    });
    render();
  });
  
  function reset() {
    if (__data.length == 0) {
      __data[0] = {
        id: 0
      };
    }
  };

  function render() {
    
    Utils.leftbar(
      __objs,
      __data[0].id,
      'Enrollments',
      'student_title__',
      function(page) {
        Url.redirect(__redmd, __sys + '.php?i=' + __id + '&__file=' + __file + '&id=' + __data[0].id + '&pg=' + page);
      }
    );
    render_data();
  };
  
  function render_data() {
    Url.insert_param('id', __data[0].id);
    $('#enrl_title').html(((__data[0].is_enrolled == 0) ? '(Not Enrolled) ' : '') + __data[0].student_title__ + ' ' + __data[0].start_academic + ' - ' + __data[0].end_academic + ' ' + __data[0].program_name);

    if (__data[0].is_current == 1) {
      $('#current').prop('checked', 'checked');
    } else {
      $('#current').removeAttr('checked');
    }

    if (__data[0].is_enrolled == 0) {
      $('#current').prop('disabled', 'disabled');
    } else {
      $('#current').removeAttr('disabled');
    }
    
    $('#fl_enrollment_form').val(__data[0].fl_enrollment_form);
    $('#fl_contact_form').val(__data[0].fl_contact_form);
    $('#fl_agreement_form').val(__data[0].fl_agreement_form);
    $('#fl_trustaccount_form').val(__data[0].fl_trustaccount_form);
    $('#fl_offer').val(__data[0].fl_offer);
    
    $('#fl_confirmation').val(__data[0].fl_confirmation);
    $('#fl_receipt').val(__data[0].fl_receipt);
    $('#fl_passport').val(__data[0].fl_passport);
    $('#fl_visa').val(__data[0].fl_visa);
    $('#fl_ielts').val(__data[0].fl_ielts);

    $('#fl_academic').val(__data[0].fl_academic);
    $('#fl_certificate').val(__data[0].fl_certificate);
    $('#fl_insurance').val(__data[0].fl_insurance);
    $('#fl_under18').val(__data[0].fl_under18);
    $('#fl_note').val(__data[0].fl_note);
    
    $('#fl_passport_no').val(__data[0].fl_passport_no);
    $('#fl_passport_expiry').val(__data[0].fl_passport_expiry);
    $('#fl_visa_type').val(__data[0].fl_visa_type);
    $('#fl_visa_expiry').val(__data[0].fl_visa_expiry);
    $('#fl_insurance_com').val(__data[0].fl_insurance_com);
    $('#fl_insurance_expiry').val(__data[0].fl_insurance_expiry);
    $('#fl_insurance_number').val(__data[0].fl_insurance_number);
    
    $("#fl_visa_type").trigger("chosen:updated");

    if (__data[0].fl_passport_no == '' && __data[0].__passport_no != '') {
      $('#fl_passport_no').val(__data[0].__passport_no);
    }
    if (__data[0].fl_passport_expiry == '0000-00-00' && __data[0].__passport_expiry != '0000-00-00') {
      $('#fl_passport_expiry').val(__data[0].__passport_expiry);
    }

    render_history();
  };

  function render_history() {
    if (__history.length == 0) {
      $("#history").html('<button class="pure-button pure-button-nohis">No History Found</button>');
    } else {
      $("#history").empty();
      $("#history").append('<h3>Histories</h3>');
      $("#history").append('<div id="history_div"></div>');

      for (var idx in __history) {
        var itm = __history[idx];
        $("#history_div").append('<h3>(' + ((itm.is_current == 0) ? ((itm.is_enrolled == 0) ? ((itm.is_paid == 0) ? 'Unpaid' : 'Paid') : 'Enrolled') : 'Completed') + ') ' + itm.start_academic + ' - ' + itm.end_academic + ' ' + itm.program_name + '</h3>');
        $("#history_div").append('<div id="history_' + itm.id + '" class="pure-form pure-form-aligned pure_form_extra" style="padding: 10px; width: 850px;"></div>');

        $("#history_" + itm.id).append(
          '<button class="pure-button pure-button-copy" onclick="copy_to(' + itm.id + ')">Copy to Above</button>' +
          '<table class="lo">' +
            '<tr>' +
              '<td class="twin">' +
                '<div class="pure-control-group">' +
                  '<label>Application for Admission (Enrollment Form)</label>' +
                  '<input type="text" readonly="true" value="' + itm.fl_enrollment_form + '" />' +
                '</div>' +
                '<div class="pure-control-group">' +
                  '<label>Student Contact Detail Form</label>' +
                  '<input type="text" readonly="true" value="' + itm.fl_contact_form + '" />' +
                '</div>' +
                '<div class="pure-control-group">' +
                  '<label>Student Agreement Form</label>' +
                  '<input type="text" readonly="true" value="' + itm.fl_agreement_form + '" />' +
                '</div>' +
                '<div class="pure-control-group">' +
                  '<label>Trust Acknowledgement Form</label>' +
                  '<input type="text" readonly="true" value="' + itm.fl_trustaccount_form + '" />' +
                '</div>' +
                '<div class="pure-control-group">' +
                  '<label>Offer of Place</label>' +
                  '<input type="text" readonly="true" value="' + itm.fl_offer + '" />' +
                '</div>' +
                '<div class="pure-control-group">' +
                  '<label>Confirmation of Place</label>' +
                  '<input type="text" readonly="true" value="' + itm.fl_confirmation + '" />' +
                '</div>' +
                '<div class="pure-control-group">' +
                  '<label>Receipt</label>' +
                  '<input type="text" readonly="true" value="' + itm.fl_receipt + '" />' +
                '</div>' +
                  '<div class="pure-control-group">' +
                  '<label>Copy of Passport</label>' +
                  '<input type="text" readonly="true" value="' + itm.fl_passport + '" />' +
                '</div>' +
                '<div class="pure-control-group">' +
                  '<label>Copy of Visa</label>' +
                  '<input type="text" readonly="true" value="' + itm.fl_visa + '" />' +
                '</div>' +
              '</td>' +
              '<td class="twin">' +
                '<div class="pure-control-group">' +
                  '<label>IELTS Result (Language Ability Certificate)</label>' +
                  '<input type="text" readonly="true" value="' + itm.fl_ielts + '" />' +
                '</div>' +
                '<div class="pure-control-group">' +
                  '<label>Academic Transcript (Latest)</label>' +
                  '<input type="text" readonly="true" value="' + itm.fl_academic + '" />' +
                '</div>' +
                '<div class="pure-control-group">' +
                  '<label>School Certificate (Qualification, Etc.)</label>' +
                  '<input type="text" readonly="true" value="' + itm.fl_certificate + '" />' +
                '</div>' +
                '<div class="pure-control-group">' +
                  '<label>School Certificate (Qualification, Etc.)</label>' +
                  '<input type="text" readonly="true" value="' + itm.fl_insurance + '" />' +
                '</div>' +
                '<div class="pure-control-group">' +
                  '<label>International Student Insurance</label>' +
                  '<input type="text" readonly="true" value="' + itm.fl_under18 + '" />' +
                '</div>' +
                '<div class="pure-control-group">' +
                  '<label style="width: 75px !important;">Note</label>' +
                  '<textarea disabled="disabled" style="resize: none; height: 150px; width: 320px;">' + itm.fl_note + '</textarea>' +
                '</div>' +
              '</td>' +
            '</tr>' +
          '</table>' +
          '<div>&nbsp;</div>' +
          '<div class="fl_extra">' +
            '<table class="lo" cellPadding="0" cellSpacing="0">' +
              '<tr>' +
                '<td class="triplet">' +
                  '<div class="pure-control-group">' +
                    '<label>Passport No.</label>' +
                    '<input readonly="true" type="text" value="' + itm.fl_passport_no + '" />' +
                  '</div>' +
                  '<div class="pure-control-group">' +
                    '<label>Passport Expiry</label>' +
                    '<input readonly="true" type="text" value="' + itm.fl_passport_expiry + '" />' +
                  '</div>' +
                '</td>' +
                '<td class="triplet">' +
                  '<div class="pure-control-group">' +
                    '<label>Visa Type</label>' +
                    '<input readonly="true" type="text" value="' + itm.fl_visa_type + '" />' +
                  '</div>' +
                  '<div class="pure-control-group">' +
                    '<label>Visa Expiry</label>' +
                    '<input readonly="true" type="text" value="' + itm.fl_visa_expiry + '" />' +
                  '</div>' +
                '</td>' +
                '<td class="triplet">' +
                  '<div class="pure-control-group">' +
                    '<label>INS Company</label>' +
                    '<input readonly="true" type="text" value="' + itm.fl_insurance_com + '" />' +
                  '</div>' +
                  '<div class="pure-control-group">' +
                    '<label>INS Expiry</label>' +
                    '<input readonly="true" type="text" value="' + itm.fl_insurance_expiry + '" />' +
                  '</div>' +
                  '<div class="pure-control-group">' +
                    '<label>INS Policy No.</label>' +
                    '<input readonly="true" type="text" value="' + itm.fl_insurance_number + '" />' +
                  '</div>' +
                '</td>' +
              '</tr>' +
            '</table>' +
          '</div>'
        );
      }

      $("#history_div").accordion({
        heightStyle: "content",
        collapsible:true,
        beforeActivate: function(event, ui) {
          // The accordion believes a panel is being opened
          if (ui.newHeader[0]) {
            var currHeader  = ui.newHeader;
            var currContent = currHeader.next('.ui-accordion-content');
            // The accordion believes a panel is being closed
          } else {
            var currHeader  = ui.oldHeader;
            var currContent = currHeader.next('.ui-accordion-content');
          }
          // Since we've changed the default behavior, this detects the actual status
          var isPanelSelected = currHeader.attr('aria-selected') == 'true';
          // Toggle the panel's header
          currHeader.toggleClass('ui-corner-all',isPanelSelected).toggleClass('accordion-header-active ui-state-active ui-corner-top',!isPanelSelected).attr('aria-selected',((!isPanelSelected).toString()));
          // Toggle the panel's icon
          currHeader.children('.ui-icon').toggleClass('ui-icon-triangle-1-e',isPanelSelected).toggleClass('ui-icon-triangle-1-s',!isPanelSelected);
          // Toggle the panel's content
          currContent.toggleClass('accordion-content-active',!isPanelSelected)    
          if (isPanelSelected) { currContent.slideUp(); }  else { currContent.slideDown(); }
          return false; // Cancel the default action
        }
      });
    }
  };

  function copy_to(id) {
    var obj = Utils.get_by_id(id, __history);
    
    __data[0].fl_enrollment_form = obj.fl_enrollment_form;
    __data[0].fl_contact_form = obj.fl_contact_form;
    __data[0].fl_agreement_form = obj.fl_agreement_form;
    __data[0].fl_trustaccount_form = obj.fl_trustaccount_form;
    __data[0].fl_offer = obj.fl_offer;

    __data[0].fl_confirmation = obj.fl_confirmation;
    __data[0].fl_receipt = obj.fl_receipt;
    __data[0].fl_passport = obj.fl_passport;
    __data[0].fl_visa = obj.fl_visa;
    __data[0].fl_ielts = obj.fl_ielts;

    __data[0].fl_academic = obj.fl_academic;
    __data[0].fl_certificate = obj.fl_certificate;
    __data[0].fl_insurance = obj.fl_insurance;
    __data[0].fl_under18 = obj.fl_under18;
    __data[0].fl_note = obj.fl_note;

    __data[0].fl_passport_no = obj.fl_passport_no;
    __data[0].fl_passport_expiry = obj.fl_passport_expiry;
    __data[0].fl_visa_type = obj.fl_visa_type;
    __data[0].fl_visa_expiry = obj.fl_visa_expiry;
    __data[0].fl_insurance_com = obj.fl_insurance_com;
    __data[0].fl_insurance_expiry = obj.fl_insurance_expiry;
    __data[0].fl_insurance_number = obj.fl_insurance_number;

    render();
  };

  function submit_obj() {
    req = __data[0];
    
    req.__fl_update_personal = $('#fl_update_personal').is(':checked') ? 1 : 0;
    
    req.is_current = $('#current').is(':checked') ? 1 : 0;
    
    req.fl_enrollment_form = $('#fl_enrollment_form').val();
    req.fl_contact_form = $('#fl_contact_form').val();
    req.fl_agreement_form = $('#fl_agreement_form').val();
    req.fl_trustaccount_form = $('#fl_trustaccount_form').val();
    req.fl_offer = $('#fl_offer').val();

    req.fl_confirmation = $('#fl_confirmation').val();
    req.fl_receipt = $('#fl_receipt').val();
    req.fl_passport = $('#fl_passport').val();
    req.fl_visa = $('#fl_visa').val();
    req.fl_ielts = $('#fl_ielts').val();

    req.fl_academic = $('#fl_academic').val();
    req.fl_certificate = $('#fl_certificate').val();
    req.fl_insurance = $('#fl_insurance').val();
    req.fl_under18 = $('#fl_under18').val();
    req.fl_note = $('#fl_note').val();

    req.fl_passport_no = $('#fl_passport_no').val();
    req.fl_passport_expiry = $('#fl_passport_expiry').val();
    req.fl_visa_type = $('#fl_visa_type :selected').val();
    req.fl_visa_expiry = $('#fl_visa_expiry').val();
    req.fl_insurance_com = $('#fl_insurance_com').val();
    req.fl_insurance_expiry = $('#fl_insurance_expiry').val();
    req.fl_insurance_number = $('#fl_insurance_number').val();
    
    req.__pg = __objs.p;
    
    Ajax.request(
      __requrl + 'submit_obj',
      'req=' + Utils.encodeURI(JSON.stringify(req)),
      function(rslt) {
        if (rslt.__objs) {
          __objs = rslt.__objs;
          delete rslt.__objs;
        }
        __data[0] = rslt;
        render();
      },
      null
    );
  };

  function get_obj(id) {
    var req = {
      id: id
    };
    Ajax.request(
      __requrl + 'get_obj',
      'req=' + Utils.encodeURI(JSON.stringify(req)),
      function(rslt) {
        __data = rslt;
        __history = rslt[0].__history;
        delete rslt[0].__history;
        render();
      },
      null
    );
    return false;
  };
  /*]]>*/
</script>